<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="UTF-8">
    <title>子任务列表</title>
    <!-- JS -->
    <script type="text/javascript" th:src="@{/myconfig/bootstrap/js/jquery.js}" src="myconfig/bootstrap/js/jquery.js"></script>
    <script type="text/javascript" th:src="@{/myconfig/bootstrap/js/bootstrap.min.js}" src="myconfig/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" th:src="@{/myconfig/layui/layui.js}" src="myconfig/layui/layui.js"></script>
    <script type="text/javascript" th:src="@{/itemAndTask/js/jquery.params.js}" src="itemAndTask/js/jquery.params.js"></script>



    <!-- CSS -->
    <link th:href="@{/myconfig/bootstrap/css/bootstrap.min.css}" href="myconfig/bootstrap/css/bootstrap.min.css" type="text/css" rel="stylesheet" media="all">
    <link th:href="@{/myconfig/layui/css/layui.css}" href="myconfig/layui/css/layui.css" type="text/css" rel="stylesheet" media="all">
</head>
<body>



<!--模仿bootstrap的模态框 新建子任务-->
<div id="newTask" style="display: none">
    <div class="layui-form-item">
        <label class="layui-form-label">所属事项</label>
        <div class="layui-input-inline">
            <select name="item.itemName">
                <option value="">请选择</option>
                <option>静态测试</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">文件类型</label>
        <div class="layui-input-inline">
            <select name="fileType.typeName">
                <option value="">请选择</option>
                <option>静态测试</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">是否公开</label>
        <div class="layui-col-md12">
            <input type="checkbox" name="fileState" lay-skin="switch" lay-text="公开|未公开">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-card">
            <div class="layui-card-body">
                <div class="layui-upload">
                    <button type="button" class="layui-btn layui-btn-normal" id="test-upload-change">选择文件</button>
                    <!--<button type="button" class="layui-btn" id="test-upload-change-action">开始上传</button>-->
                </div>
            </div>
        </div>
    </div>


    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">文件备注</label>
        <div class="layui-input-block">
            <textarea placeholder="请输入内容" class="layui-textarea" name="fileContent"></textarea>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit="" lay-filter="demo1" id="test-upload-change-action">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</div>

<!-- 数据表格 -->
<table class="layui-hide" id="listTask" lay-filter="tasks"></table>

<script type="text/html" id="listTaskToolbar">
    <div class="layui-btn-container">

        <button class="layui-btn layui-btn-sm layui-btn-warm" lay-event="backItem"><span class="layui-icon layui-icon-link">&nbsp;返回事项列表</span></button>
    </div>


</script>

<!-- 表格 格式 紧急状况 -->
<script type="text/html" id="itemTaskStatus">
    {{#  if(d.itemTaskStatus.statusName === '已完成'){ }}
    <span><i class="layui-badge-dot layui-bg-green"></i>{{ d.itemTaskStatus.statusName }}</span>
    {{#  } else { }}
    <span><i class="layui-badge-dot layui-bg-red"></i>{{ d.itemTaskStatus.statusName }}</span>
    {{#  } }}
</script>


<script th:inline="none">


    /* 分页查看所有区级事项 */
    var itemUrengcy=$.query.get("itemUrengcy");
    var urengcyId=0;
    if(itemUrengcy=="\"紧急\""){
        urengcyId=2;
    }else {
        urengcyId=1;
    }
    var itemId=$.query.get("itemId");
    var type=$.query.get("type");
    //alert(itemUrengcy)
    layui.use('table', function() {
        var table = layui.table;
        var $ = layui.$;
        $.ajax({
            type: "post",
            url: "itemTask/listById", // 数据接口
            data:{
                "itemId":itemId
            },
            success: function (result) {
                var data = result.data;
                table.render({
                    id:'tasks',
                    elem: '#listTask',
                    title:'子任务列表',
                    toolbar: '#listTaskToolbar',
                    data: data,
                    height: 520,
                    cols: [[
                        {type: 'radio',width: '5%'}
                        , {field: 'itemTaskId', title: 'ID', sort: true, width: '10%', align: 'center'}
                        , {field: 'itemTaskWorker', title: '执行人', sort: true,width: '15%', align: 'center',
                            templet:'<div>{{d.itemTaskWorker.userName}}</div>'}
                        , {field: 'item', title: '所属事项', sort: true, width: '15%', align: 'center',
                            templet:'<div>{{d.item.itemName}}</div>'}
                        , {field: 'itemTaskStatus', title: '任务状态',sort: true, width: '15%', align: 'center',
                            templet:'#itemTaskStatus'}
                        , {field: 'itemTaskContent', title: '任务内容', width: '25%', align: 'center'}
                        , {field: 'itemTaskTime', title: '发布时间', sort: true,width: '15%', align: 'center'}

                    ]],
                    page: true, //是否显示分页
                    limits: [5, 10, 15,20], //每页显示个数
                    limit: 10, //每页默认显示的数量
                    group:5   //页码最多显示个数
                });
            }
        });

        /* 工具栏监听事件 */
        table.on('toolbar(tasks)', function(obj){     //tasks 为table表的ID
            var checkStatus = table.checkStatus(obj.config.id); //获取选中行状态
            switch(obj.event){
                /* 删除一个任务 */

                /* 返回事项列表*/
                case 'backItem':
                    $(".layui-table-body tr").removeClass('layui-table-click');
                    back();
                    break;
            };
        });
    });



</script>

<!--模态框-->


<!--传输后台-->
<script >
    //返回事项列表
    function back() {
        //alert(type)
        location.href="MyItems.html";


    }


</script>
</body>
</html>